<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>图片轮播</title>
		<link rel="stylesheet" href="css/picture.css" />
		<script src="js/picture.js"></script>
	</head>
	<body>
		<div id="container">
			<div id="list" style="left: -900px;">
				<img src="img/1.jpg" alt="1">
				<img src="img/2.jpg" alt="1">
				<img src="img/3.jpg" alt="2">
				<img src="img/4.jpg" alt="3">
				<img src="img/5.jpg" alt="4">
				<img src="img/6.jpg" alt="5">
				<img src="img/7.jpg" alt="5">
			</div>
			<div id="buttons">
				<span index="1" class="on"></span>
				<span index="2"></span>
				<span index="3"></span>
				<span index="4"></span>
				<span index="5"></span>
			</div>
			<a href="javascript:;" id="prev" class="arrow">&lt;</a>
			<a href="javascript:;" id="next" class="arrow">&gt;</a>
		</div>


	</body>

</html>
